<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
    <title>亿人宝 - 公告详细</title>
    <meta content="" name="keywords"/>
    <meta content="" name="description"/>
    <link rel="stylesheet" th:href="@{/css/common.css}"/>
    <link rel="stylesheet" th:href="@{/css/index.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/about.css}" type="text/css">
    <script th:src="@{/script/jquery.min.js}" type="text/javascript"></script>
    <script th:src="@{/script/common.js}" type="text/javascript"></script>
    <script th:src="@{/script/vue.min.js}" type="text/javascript"></script>
    <script th:src="@{/script/axios.min.js}" type="text/javascript"></script>
    <script th:src="@{/layui/layer/layer.js}" type="text/javascript"></script>
</head>
<body>
<div id="app">
    <div th:replace="common/public::head"></div>

    <!--关于我们-->
    <div class="bg">
        <input id="nid" th:value="${id}" type="hidden">
        <div class="contain" id="tabs" style="margin:0 auto;">
            <div class="text-box">
                <div class="text-content" id="text-content">
                    <header class="article-header">
                        <div class="article-title"><a href="javascript:void(0);">{{notice.title}}</a></div>
                        <div class="article-meta">
                            <span class="item">{{notice.createDate | formatDate}}</span>
                            <span class="item">分类：<a href="javascript:void(0);" rel="category tag">{{notice.classify}}</a></span>
                        </div>
                    </header>
                    <article class="article-content">
                        <p style="text-align: center;"><br></p>
                        <p style="padding-top: 10px; list-style-type: none; margin-top: 0px; margin-bottom: 0px; outline: invert none medium; list-style-image: none; text-indent: 2em; color: rgb(51, 51, 51); font-family: ''; font-size: 14px; font-style: normal; font-variant: normal; line-height: 25.2000007629395px; white-space: normal;"
                           v-html="notice.content">
                        </p>
                        <p></p>
                    </article>
                </div>
            </div>
        </div>
    </div>

    <!--网站底部-->
    <div th:replace="common/public::footer"></div>
</div>
<script type="text/javascript">
    const baseUrl = '[[@{/base/}]]';
    const id = $('#nid').val();
    new Vue({
        el: '#app',
        data: {
            notice: {}
        },
        filters: {
            formatDate: function (value) {
                let date = new Date(value);
                let y = date.getFullYear();
                let MM = date.getMonth() + 1;
                MM = MM < 10 ? ('0' + MM) : MM;
                let d = date.getDate();
                d = d < 10 ? ('0' + d) : d;
                let h = date.getHours();
                h = h < 10 ? ('0' + h) : h;
                let m = date.getMinutes();
                m = m < 10 ? ('0' + m) : m;
                let s = date.getSeconds();
                s = s < 10 ? ('0' + s) : s;
                return y + '-' + MM + '-' + d;
            },
        },
        methods: {
            //加载公告
            loadNotice: function () {
                axios.get(baseUrl + 'findNoticeById/' + id)
                    .then(response => {
                        console.log(response);
                        this.notice = response.data.obj;
                    })
                    .catch(function (error) {
                        console.log(error);
                    })
            }
        },
        mounted() {
            this.loadNotice();
        }
    });
</script>
</body>
</html>
